<template>
    <div class="friend2">
        <p>{{msg}}</p>
        发送消息：<input type="text" name="" id="friend2" 
        v-model="postMsg2" placeholder="可以发消息给甲"> <button @click="postMsgFn">发送</button><br>
        <button @click="getMsgFn">接收</button> 收到消息：{{getMsg2}}
    </div>
</template>

<script>
import FriendBus from '../model/friendBus.js'

export default {
    data () {
        return {
            msg: '朋友乙',
            postMsg2: '',
            getMsg2: ''
        }
    },
    methods: {
        postMsgFn() {
            //alert(this.postMsg);
            FriendBus.$emit('to-friend1',this.postMsg2);
        },
        getMsgFn() {            
            FriendBus.$on('to-friend2',function(data) {
                this.getMsg2 = data;
            })
        }
    },
    mounted () {
        
    }
}
</script>

<style>
div.friend2{
    width: 40%;
    padding: 20px;
    border: 1px solid cyan;
}
</style>
